<?php
header("content-type:text/html;charset=utf8");
$link =@mysql_connect('127.0.0.1','root','root');
if(!$link){
    die('连接失败，错误号为：'.mysql_errno().'失败原因：'.mysql_error());
}
mysql_select_db('blog');
mysql_set_charset('utf8');
$sql = "select * from `article` order by id asc";
$res = mysql_query($sql) or mysql_error();
$arr = array();
while ($row = mysql_fetch_assoc($res)){
    $arr[] = $row;
}
// var_dump($arr);die;

//var_dump($arr);
mysql_free_result($res);
mysql_close();
?>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>我的博客</title>
		
		<!-- CSS -->
		<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
		<link rel="stylesheet" href="css/social-icons.css" type="text/css" media="screen" />
	
		<!-- THEME -->
		<link rel="stylesheet" href="skins/paper-brown/style.css" type="text/css" media="screen" />
		
		<!-- JS -->
		<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
		<script type="text/javascript" src="js/jqueryui.js"></script>
		<script type="text/javascript" src="js/easing.js"></script>
		<script type="text/javascript" src="js/jquery.scrollTo-1.4.2-min.js"></script>
		<script type="text/javascript" src="js/quicksand.js"></script>
		<script type="text/javascript" src="js/custom.js"></script>
		<!--[if IE]>
			<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
		<![endif]-->
		<!-- ENDS JS -->
		
		<!--[if IE 6]>
			<script type="text/javascript" src="js/DD_belatedPNG.js"></script>
			<script>
	      		/* EXAMPLE */
	      		//DD_belatedPNG.fix('*');
	    	</script>
		<![endif]-->
		
		
		<!-- superfish -->
		<link rel="stylesheet" media="screen" href="css/superfish.css" /> 
		<link rel="stylesheet" media="screen" href="css/superfish-left.css" /> 
		<script type="text/javascript" src="js/superfish-1.4.8/js/hoverIntent.js"></script>
		<script type="text/javascript" src="js/superfish-1.4.8/js/superfish.js"></script>
		<script type="text/javascript" src="js/superfish-1.4.8/js/supersubs.js"></script>
		<!-- ENDS superfish -->
		
		<!-- poshytip -->
		<link rel="stylesheet" href="js/poshytip-1.0/src/tip-twitter/tip-twitter.css" type="text/css" />
		<link rel="stylesheet" href="js/poshytip-1.0/src/tip-yellowsimple/tip-yellowsimple.css" type="text/css" />
		<script type="text/javascript" src="js/poshytip-1.0/src/jquery.poshytip.min.js"></script>
		<!-- ENDS poshytip -->
		
		<!-- Tweet -->
		<link rel="stylesheet" href="css/jquery.tweet.css" media="all"  type="text/css"/> 
		<script src="js/tweet/jquery.tweet.js" type="text/javascript"></script> 
		<!-- ENDS Tweet -->
		
		<!-- Fancybox -->
		<link rel="stylesheet" href="js/jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
		<script type="text/javascript" src="js/jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
		<!-- ENDS Fancybox -->
		
		<!-- jflickrfeed -->
		<link href="css/jflickrfeed.css" rel="stylesheet" type="text/css" media="screen" /> 
		<script src="js/jflickrfeed/jflickrfeed.js"></script>
		
		<link href="js/jflickrfeed/colorbox/colorbox.css" rel="stylesheet" type="text/css" media="screen" /> 
		<script src="js/jflickrfeed/colorbox/jquery.colorbox.js"></script>
		<!-- ENDS jflickrfeed -->
		
		<!-- prettyPhoto -->
		<script type="text/javascript" src="js/prettyPhoto/js/jquery.prettyPhoto.js"></script>
		<link rel="stylesheet" href="js/prettyPhoto/css/prettyPhoto.css" type="text/css" media="screen" />
		<!-- ENDS prettyPhoto -->
		
		
				
		<!-- Nivo slider -->
		<link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen" />
		<script src="js/nivo-slider/jquery.nivo.slider.js" type="text/javascript"></script>
		<!-- ENDS Nivo slider -->
		
		<!-- tabs -->
		<link rel="stylesheet" href="css/tabs.css" type="text/css" media="screen" />
		<script type="text/javascript" src="js/tabs.js"></script>
  		<!-- ENDS tabs -->

		<!--[if IE 7]>
			<link rel="stylesheet" type="text/css" media="screen" href="css/ie7-hacks.css" />
		<![endif]-->
		<!--[if IE 8]>
			<link rel="stylesheet" type="text/css" media="screen" href="css/ie8-hacks.css" />
		<![endif]-->
		<!-- ENDS CSS -->	
		
	</head>
	<body>
	
	<!-- WRAPPER -->
	<div id="wrapper">
	
		<!-- SIDEBAR -->
		<div id="sidebar">
			<!-- logo -->
			<a href="index.php"><img src="img/logo.png" alt="Left template" id="logo" /></a>
						
			<!-- search -->
			<form  method="get" id="searchform" action="#">
				<div>
					<input type="text" value="Search..." name="s" id="s" onfocus="defaultInput(this)" onblur="clearInput(this)" />
					<input type="submit" id="searchsubmit" value=" " />
				</div>
			</form>
			<!-- ENDS search -->
						
			<!-- Navigation -->
			<ul id="nav" class="sf-menu sf-vertical">
				<li ><a href="index.php">首页</a></li>
				
				<li><a href="gallery.php">画廊</a>
					<ul>
						<li><a href="gallery.php">图片库</a>
							<ul>
								<li><a href="gallery.php">两列布局</a></li>
								<li><a href="gallery-fourcols.php">四列布局</a></li>
							</ul>
						</li>
						<li><a href="gallery-video.php">视频库</a></li>
					</ul>
				</li>
				<li class="current-menu-item"><a href="blog.php">博客</a>
					<ul>
						<li><a href="blog.php">博客全文</a></li>
						<li><a href="blog-compact.php">博客简介</a></li>
					</ul>
				</li>
				
				<li><a href="contact.php">联系方式</a></li>
				<li><a href="http://www.cssmoban.com/">立即下载!</a></li>
			</ul>
			<!-- Navigation -->	
					
			<!-- categories -->
			<ul class="cat-list">
				<li><h6>分类</h6></li>
				<li><a href="#" title="View posts">设计1 (11)</a></li>
				<li><a href="#" title="View all posts">网页1 (6)</a></li> 
				<li><a href="#" title="View all posts">照片1 (3)</a></li>
				<li><a href="#" title="View all posts">编码1 (16)</a></li>
				<li><a href="#" title="View all posts">设计2 (41)</a></li>
				<li><a href="#" title="View all posts">网页2 (6)</a></li> 
				<li><a href="#" title="View all posts">照片2 (5)</a></li> 
				<li><a href="#" title="View all posts">编码2 (23)</a></li>
			</ul>
			<!-- categories -->	
			
			
			
			<!-- Social -->
			<ul class="social">
				<li><h6>关注我们</h6>
				<li><a href="#" class="facebook" title="成为粉丝"></a></li>
                <li><a href="#" class="twitter" title="我们的微博"></a></li>
                <li><a href="#" class="dribbble" title="我们的工作"></a></li>
                <li><a href="#" class="addthis" title="告诉大家"></a></li>
                <li><a href="#" class="vimeo" title="我们的视频"></a></li>
                <li><a href="#" class="youtube" title="我们的YouTube"></a></li>
			</ul>
			<!-- ENDS Social -->
			
		</div>
		<!-- ENDS SIDEBAR -->
		
		<!-- MAIN -->
		<div id="main">

			<!-- HEADER -->
			<div id="header">
				<div id="page-title">博客</div>
				<!-- Breadcrumb-->
				<div id="breadcrumbs">
					你的位置: 
					<a title="Home" href="index.php">首页</a> &raquo; 
					<a title="Features" href="blog.php">博客</a> &raquo;
				</div>
				<!-- ENDS Breadcrumb-->	
			</div>
			<!-- ENDS HEADER -->
			
			<!-- CONTENT -->
			<div id="content">
						
				<!-- PAGE CONTENT -->
				<div id="page-content">
				
					<!-- Posts -->
					<div class="post compact">
						<!-- feature image -->
						<?php
                            foreach($arr as $v){
                                echo  '<li> <div class="block">
                                <a href="single.php" title="Title" ><img class="cover" src="img/dummies/272x250.jpg" alt="Alt text" title="Title"/><br>'.$v["title"].'</a>
                            </div>
                            <div class="the-excerpt">
                                '.mb_substr($v['describe'],0,20,"UTF-8").'
                            </div>
                            <a href="single.php?id='.$v['id'].'" class="link-button"><span>查看全文</span></a>
                        </li>';
                            }
                           
                    
                            
                        ?>
						<div class="clear"></div>
					</div>
					<!-- ENDS posts -->
					
					<!-- Pagination -->
					<ul class='pager'>
						<li class="first-child"><a href="#">上一页</a></li>
						<li class="active"><a href="#">1</a></li>
						<li><a href="#">2</a></li>
						<li><a href="#">3</a></li>
						<li><a href="#">4</a></li>
						<li><a href="#">5</a></li>
						<li class="last-child"><a href="#">下一页</a></li>
					</ul>
					<!-- ENDS Pagination -->
	
					
				</div>
				<!-- ENDS PAGE-CONTENT -->
			
			</div>
			<!-- ENDS CONTENT -->
			
		</div>
<div>
    <aside style="position:absolute;top:0;right:100px;width:400px;margin:20px;">
    <img src="./img/wu.jpg" alt="" width="400" height="280">
        <nav>
        <h2><a href="/">个人博客</a></h2>
        <br>
        <ul>
            <li><a href="http://itbyc.com/log/"  title="王凯心得" target="_blank">王凯心得</a></li>
            <li><a href="http://itbyc.com/travel/" title="雨在路上" target="_blank">雨在路上</a></li>
            <li><a href="http://itbyc.com/regex/regex.html" title="正则表达式" target="_blank">正则表达式</a></li>
        </ul>      
        </nav>
        <p class="slider"> 
        <a href="#">这个世界根本不存在“不会做”这回事，当你失去所有依靠的时候，你自然就什么都会了。</a>
        </p>
        <br>
        <div class="vcard" style="color:#c00">
            <a href="/" target="_blank" title="个人档案"><img src="./img/wuerqiaola.jpg" alt="个人网站" class="photo" height="124" width="93"></a>
              <p class="fn">姓名:王凯</p>
              <p class="nickname">网名：二狗子</p>
              <p class="role">职业：召唤师峡谷ADC</p>
              <p class="url">主页：itbyc.com</p>
              <p class="address">现居：湖北武汉</p>
        </div>
    <p id="animation" class="qun" style="color:#00F">网站开发+QQ：1072253293  </p>
    <div id="bdshare" class="bdshare_t bds_tools_32 get-codes-bdshare" style="clear:both">
        <a class="bds_qzone"></a>
        <a class="bds_tqq"></a>
        <a class="bds_t163"></a>
        <a class="bds_tsina"></a>
        <span class="bds_more"></span>
        <a class="shareCount"></a>
    </div>
    <br>
    <div class="hotcomm">
      <h2> <a href="/">精彩文章推荐</a></h2>
      <br>
      <ul>
        <li><a title="个人博客的内页如何优化" href="blog.php">个人博客的内页如何优化</a></li>
        <li><a title="个人博客如何减少跳出提高流量" href="blog.php">个人博客如何减少跳出提高流量</a></li>
        <li><a title="个人博客品牌形象如何建立" href="blog.php">个人博客品牌形象如何建立</a></li>
        <li><a title="个人博客如何获得优质外链" href="blog.php">个人博客如何获得优质外链</a></li>

        </ul>
    </div>
        <br>
       <div class="newbolg">
          <h2><a href="/">技术探讨</a></h2>
          <br>
             <ul class="rank">
            <li><a title="如何在网页设计中使用留白？" href="blog.php">如何在网页设计中使用留白？</a></li>
            <li><a title="2014，感谢有你" href="blog.php">2014，感谢有你</a></li>
            <li><a title="网站跳出率高的优化方案" href="blog.php">网站跳出率高的优化方案</a></li>
            <li><a title="PHP如何获取内存使用情况" href="blog.php">PHP如何获取内存使用情况</a></li>
            <li><a title="PHP动态页生成静态页的程序代码" href="blog.php">PHP动态页生成静态页的程序代码</a></li>
            </ul>  
            <br>
        <h2><a href="/">点击排行</a></h2>
        <br>
             <ul class="rank">
            <li><a title="discuz教程：门户文章添加tag标签功能" href="/cms/discuz/16688.html">discuz教程：门户文章添加tag标</a></li>
            <li><a title="discuz允许游客表态的方法" href="/cms/discuz/16684.html">discuz允许游客表态的方法</a></li>
            <li><a title="discuz会员忘记安全提问的解决方法" href="/cms/discuz/16683.html">discuz会员忘记安全提问的解决方</a></li>
            <li><a title="dedecms搜索页面只显示10条搜索结果的解决方法" href="/web/dedecms/16680.html">dedecms搜索页面只显示10条搜索</a></li>
            </ul>   
        </div>
<!-- <div class="tag_yun">
    <h2>博客热点</h2>
    <div class="tag_yun_list">
    {\dede\:\tag row='50' getall='1' sort='hot'}
<a style="[field:total runphp=yes]@me=getTagStyle(); [/field:total];" title="[field:tag /]([field:total /])" href="[field:link/]">[field:tag /]</a>
{\/dede\:\tag}
    </div>
    </div>
-->
</aside>
</div>
		<!-- ENDS MAIN -->
	</div>
	<!-- ENDS WRAPPER -->

	<!-- FOOTER -->
	<div id="footer">
		<!-- FOOTER-WRAPPER -->
		<div id="footer-wrapper">
			<!-- footer-cols -->
			<ul id="footer-cols">
				<li class="col clear-col">
					<h6>团队主题</h6>
					I am the bone of my sword。
                    Steel is my body，and fire is my blood。
                    I have created over a thousand blades。
                    Unaware of loss。
                    Nor aware of gain。
                    With stood pain to create many weapons，waiting for one‘s arrival。
                    I have no regret。This is the only path。
                    My whole life was “unlimited blade works”.
				</li>
				<li class="col">
					<h6>分类</h6>
					<ul>
						<li><a href="#">CMS</a></li>
						<li><a href="#/">网页</a></li>
						<li><a href="#">照片</a></li>
						<li><a href="#">代码</a></li>
						<li><a href="#">网页建设</a></li>
						<li><a href="#/">市场</a></li>
						<li><a href="#">留言</a></li>
						<li><a href="#">图纸</a></li>
					</ul>
				</li>
				<!-- Flickr -->
				<li class="col">
					<h6>网络图库</h6>
					
				</li>
			<!-- ENDS Flickr -->
			</ul>
			<!-- ENDS footer-cols -->
			<!-- footer-bottom -->
			<div id="footer-bottom">
				<div id="bottom-left">
					&copy; 2011 Ansimuz. All Rights Reserved. More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a>
				</div>
				<div id="bottom-right">To top</div>
			</div>
			<!-- ENDS footer-bottom -->
		</div>
		<!-- ENDS FOOTER-WRAPPER -->
	</div>
	<!-- ENDS FOOTER -->
	
	
	</body>
</html>